<!-- eslint-disable no-unused-vars -->
<template>
  <div class="headerCom">
    <div class="row items-center">
      <div class="col-auto text-left items-center">
        <q-icon
          name="fa-solid fa-arrow-left"
          class="items-center iconBack"
          @click="back()"
        />
      </div>
      <div class="col text-center hderBox">
        <span class="titleText">{{ title }}</span>
      </div>
      <div class="col-auto text-right infoBox">
        <!-- Personal Info -->
        {{ staffID }} {{ cnName }} <br />
        {{ site }} {{ deptName }} {{ role_chinese_name }}<br />
        {{ userCode }}
      </div>
    </div>
  </div>

  <hr class="titleHr" />
</template>

<script setup>
import { useUserStore } from "src/stores/modules/userStore";
import { useRouter } from "vue-router";

const userStore = useUserStore();
const $router = useRouter();

const staffID = userStore.staffID;
const cnName = userStore.cnName;
let deptName = " ";
let deptCode = " ";
let site = " ";
let source = null;
let userCode = " ";
let role_chinese_name = " ";

if (userStore.currentDept != null) {
  console.log("currentDept: ", userStore.currentDept);
  deptName = userStore.currentDept.deptName;
  deptCode = userStore.currentDept.deptCode;
  source = userStore.currentDept.source;
  userCode = userStore.currentDept.userCode;
  role_chinese_name = userStore.currentDept.role_chinese_name;
  if (source == "4083") {
    site = "内销";
  } else if (source == "1062") {
    site = "外销";
  }
}

// eslint-disable-next-line no-unused-vars
const props = defineProps({
  title: String,
});

const back = () => {
  $router.back();
};
</script>

<style lang="scss"></style>
